<script setup lang="ts">
  import TableLayout from '@/layout/table-layout.vue';
  import { usePageTable } from '@/hooks/arco/usePageTable';

  const data = [
    {
      index: '1',
      dept: '济南精神医院',
      name: '#1号楼',
      phone: '标准房',
      position: '404',
      status: '001',
      hospital: '有人',
      action: '',
    },
  ];

  const page = usePageTable({
    searchForm: {
      state: {
        title: '',
        status: '',
      },
    },
    table: {
      apiFun(params) {
        return Promise.resolve({
          records: data,
          total: 100,
          code: 0,
        });
      },
      columns: [
        {
          title: '序号',
          dataIndex: 'index',
        },
        {
          title: '院区',
          dataIndex: 'dept',
        },
        {
          title: '建筑',
          dataIndex: 'name',
        },
        {
          title: '房名',
          dataIndex: 'phone',
        },
        {
          title: '房号',
          dataIndex: 'position',
        },
        {
          title: '床位号',
          dataIndex: 'status',
        },
        {
          title: '状态',
          dataIndex: 'hospital',
        },
        {
          title: '操作',
          dataIndex: 'action',
        },
      ],
    },
  });
</script>

<template>
  <div class="col">
    <TableLayout v-bind="page.bindProps">
      <template #searchForm="{ state }">
        <a-form-item field="title" label="房名" label-col-flex="60px">
          <a-input v-model="state.title" placeholder="请输入" allow-clear />
        </a-form-item>

        <a-form-item field="status" label="状态" label-col-flex="60px">
          <a-select v-model="state.status" placeholder="请选择" allow-clear>
            <a-option :value="0">已保存</a-option>
            <a-option :value="1">待审核</a-option>
            <a-option :value="2">通过</a-option>
            <a-option :value="3">不通过</a-option>
            <a-option :value="4">封禁</a-option>
          </a-select>
        </a-form-item>
      </template>
    </TableLayout>
  </div>
</template>

<style lang="less" scoped></style>
